<%@ page contentType="text/html;charset=UTF-8" language="java" %>

<link  type="text/css" rel="stylesheet"  href="/static/css/page.css"/>
<div class="shows">
<div id="page">
    <div style="float: left;height: 100%;" id="pageLeft">
        当前第<span> ${pageInfo.pageNum}</span> 页.总共 <span>${pageInfo.pages}</span> 页.一共 <span>${pageInfo.total}</span> 条记录
    </div>
    <div id="pageRight" style="float: right;width: 500px;line-height: 30px;height: 100%;" >
        <table style="padding: 3px">
            <tr>
                <%--首页--%>
                <td><a style=" background-color:cyan;color: #f6fcff" href="${pageContext.request.contextPath}/user/userlist?pageNum=1">首页</a></td>
                <%--上一页--%>
                <td>
                    <c:if test="${pageInfo.hasPreviousPage}">
                        <a style=" background-color:cyan;color: #f6fcff" href="${pageContext.request.contextPath}/user/userlist?pageNum=${pageInfo.pageNum-1}" aria-label="Previous">
                           上一页
                        </a>
                    </c:if>
                </td>

                <td >
                    <!--循环遍历连续显示的页面，若是当前页就高亮显示，并且没有链接-->
                    <c:forEach items="${pageInfo.navigatepageNums}" var="page_num">
                        <c:if test="${page_num == pageInfo.pageNum}">
                            <a href="#" style="color: red">${page_num}</a>
                        </c:if>
                        <c:if test="${page_num != pageInfo.pageNum}">
                            <a style="color: red" href="/user/userlist?pageNum=${page_num}">${page_num}</a>
                        </c:if>
                    </c:forEach>
                </td>
                <%--下一页--%>
                <td>
                    <c:if test="${pageInfo.hasNextPage}">
                        <a style=" background-color:cyan;color: #f6fcff" href="${pageContext.request.contextPath}/user/userlist?pageNum=${pageInfo.pageNum+1}"
                           aria-label="Next">
                           下一页
                        </a>
                    </c:if>
                </td>
            </tr>
        </table>

    </div>
</div>
</div>